<template>
  <div id="app">
    <Header v-show="$route.meta.isLogin"></Header>
    <Row>
      <Col>
        <SideMenu v-show="$route.meta.isLogin"></SideMenu>
      </Col>
      <Col span="19">
        <div class="currentPath" v-if="$route.meta.isLogin"><Icon type="md-arrow-dropright" />{{ name }}</div>
        <!-- <Button @click="addUser">添加用户</Button><br />
        <button @click="userInfo">查看用户列表</button> -->
        <!-- {{ res }}
        <Input type="text" v-model="keyword" />
        <Button @click="toSearch">搜索</Button> -->
        <router-view v-if="isRouterAlive"></router-view>
      </Col>
    </Row>

    <Footer v-show="$route.meta.show"></Footer>
  </div>
</template>

<script>
import Header from './components/Header/index.vue'
import Footer from './components/Footer/footer.vue'
import SideMenu from './components/sideMenu/sideMenu.vue'
// import { ajaxGet } from './api/axios'
export default {
  provide () {
    return {
      reload: this.reload
    }
  },
  data () {
    return {
      res: '',
      keyword: '',
      isRouterAlive: true
    }
  },
  computed: {
    name () {
      return this.$route.meta.name
    }
  },
  components: {
    Header,
    Footer,
    SideMenu,
  },
  methods: {
    reload () {
      this.isRouterAlive = false
      this.$nextTick(() => {
        this.isRouterAlive = true
      })
    },
    // 搜索按钮的回调函数：需要向search路由进行跳转
    toSearch () {
      this.$router.push({ name: "search", params: { keyword: this.keyword }, query: { k: this.keyword.toUpperCase() } })
    }
    // async GET_DATA ({ dataUrl, ...params }) {
    //   const url = ' http://127.0.0.1:8000/' + dataUrl
    //   const res = await ajaxGet(url, {
    //     ...params,
    //   })
    //   if (res) {
    //     this.res = res.data
    //   }
    // },
    // addUser () {
    //   this.GET_DATA({
    //     dataUrl: 'register',
    //     id: 'lqs',
    //     password: '123',
    //     againPassword: '123',
    //     username: '李秋珊',
    //     level: 1
    //   })
    // },
    // userInfo () {
    //   this.GET_DATA({
    //     dataUrl: 'userinfo'
    //   })
    // }
  }
}
</script>

<style lang="scss" scoped>
.currentPath {
  font-size: 17px;
  color: rgb(103, 108, 122);
  margin: 5px;
}
#app{
  overflow: scroll;
  overflow-y:hidden;
  overflow-x: hidden;
  //width:100%;
  //height: 100%;
}
</style>